<template>
	<div class="provincee">
		<div class="p-head">
			<div><img src="../../pro-img/p-1.png"/></div>
			<div class="dtt">省市台</div>
		</div>
		<div class="p-middle">
			<div class="p-u" v-for="p in pdtlist">
				<div class="p-spa1">{{p.name}}</div>
				<img src="../../pro-img/p-2.png" class="p-img2"/>
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		data(){
			return {
				pdtlist:[]
			} 
		},
		methods:{
			requestpdt(){
				this.$http({
					url:'http://localhost:8080/reee',
					method:'GET'
				}).then(function(req){
					this.pdtlist =JSON.parse(req.body).data[0].values;
				})
			},
		},
		mounted(){
			this.requestpdt();
		}
	}
</script>

<style>
	.p-middle{
		
	}
	.p-spa1{
		margin-left: 0.47826rem;
		flex-grow: 1;
	}
	.p-img2{
		width: 0.521739rem;
		height: 0.652173rem;
		margin-right: 0.543478rem;
	}
	.p-u{
		display: flex;
		align-items: center;
		font-size: 0.5rem;
		height: 1.630434rem;
		border-bottom: solid 0.021739rem #fbfbfb;
	}
	.provincee{
		z-index: 1000;
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		overflow: auto;
		background-color: white;
	}
	.p-head{
		width: 100%;
		height: 1.391304rem;
		background-color: #fbfbfb;
		display: flex;
		align-items: center;
	}
	.p-head :nth-child(1){
		margin-left: 0.308695rem;
		width: 0.673913rem;
		height: 0.673913rem;
	}
	.p-head :nth-child(2){
		width: 80%;
		text-align: center;
		font-size: 0.521739rem;
	}
</style>